<template>
	<view class="">
		<view class="e-flex e-m-b-10">
			<button
				class="refund-button goods-button"
				@tap.stop="$emit('refund', goods.deputyId, goods.id)"
				v-if="isRefund && isDetail && receivingStatus === 2 && [0, 3].includes(goods.refundStatus)"
			>
				{{ $t('order.退款') }}
			</button>
			<button
				class="min-button goods-button e-m-l-20"
				v-if="receivingStatus === 3 && goods.status === 0"
				@tap.stop="$goTo('/pages/order/comment', { id: goods.deputyId, goodsId: goods.id })"
			>
				{{ $t('order.评价') }}
			</button>
		</view>
		<view class="">
			<text class="c-primary" v-if="orderRefundStatusText[goods.refundStatus] && ![0, 3].includes(goods.refundStatus)">{{ orderRefundStatusText[goods.refundStatus].dictLabel }}</text>
		</view>
	</view>
</template>

<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
	// #ifdef MP-WEIXIN
	// 将自定义节点设置成虚拟的，更加接近Vue组件的表现
	options: {
		virtualHost: true
	}
	// #endif
});
</script>

<script setup lang="ts">
import { useOrder,useInit } from '@/common/stores';
import { storeToRefs } from 'pinia';

const props = defineProps({
	isDetail: {
		type: Boolean,
		default: false
	},
	goods: Object,
	receivingStatus: Number
});

const orderStore = useOrder();
const { orderRefundStatusText } = storeToRefs(orderStore);
const { isRefund } = storeToRefs(useInit());

if (!orderRefundStatusText.value.length) {
	orderStore.getOrderRefundStatusText();
}
</script>

<style lang="scss" scoped>
.refund-button {
	padding: 0 20rpx;
	min-width: 126rpx;
	color: #333 !important;
	background-color: #fff !important;
}
.min-button {
	width: 100rpx;
	padding: 0;
}
.goods-button {
	height: 52rpx;
	border-radius: 26rpx;
	border: 2rpx solid #b3b3b3;
	margin: 0;
	font-size: 26rpx;
	line-height: 48rpx;
}
</style>
